//审核详情页
<template>
<div>
    <common-header
        :title="title"
        :type=3></common-header>
    <div class="mui-content">
        <div class="swipe-div">
            <mt-swipe :auto="0">
                <mt-swipe-item class="slide1" v-for="(img, index) in imgList" :key="index">
                    <a href="javascript: void(0)">
                        <img :src="img" preview="0"/>
                    </a>
                </mt-swipe-item>
            </mt-swipe>
        </div>
        <div class="audit-details">
            <ul>
                <li>
                    <p class="audit-details-title">样衣编号:</p>
                    <p class="audit-details-conts">{{ data.sampleId }}</p>
                </li>
                <li>
                    <p class="audit-details-title">大类:</p>
                    <p class="audit-details-conts">{{ data.dlText }}</p>
                </li>
                <li>
                    <p class="audit-details-title">货号:</p>
                    <p class="audit-details-conts">{{ data.pcode }}</p>
                </li>
                <li>
                    <p class="audit-details-title">小类:</p>
                    <p class="audit-details-conts">{{ data.xlText }}</p>
                </li>
                <li>
                    <p class="audit-details-title">波段号:</p>
                    <p class="audit-details-conts">{{ data.bandname }}</p>
                </li>
                <li>
                    <p class="audit-details-title">合作方式:</p>
                    <p class="audit-details-conts">{{ data.jyfs }}</p>
                </li>
                <li>
                    <p class="audit-details-title">供货商编码:</p>
                    <p class="audit-details-conts">{{ data.supplierid }}</p>
                </li>
                <li>
                    <p class="audit-details-title">供货商:</p>
                    <p class="audit-details-conts">{{ data.vendername }}</p>
                </li>
            </ul>
        </div>
        <div class="audit-regula">
            <div class="audit-regula-title">
                <h1>总得分</h1>
                <label class="decision-details-label decision-details-zong oneScore-details-zong">分值</label>
            </div>
            <div class="audit-regula-cont oneScore-cont">
                <ul>
                    <li v-for="(score, i) in scoreList" :key="i">
                        <div class="mui-input-row mui-checkbox decision-details-box">
                            <label>{{ score.scoreName }}</label>
                            <div class="mui-numbox onScore-count">
                                <button class="mui-btn mui-numbox-btn-minus" type="button" @click="reduce(i)">-</button>
                                <input class="mui-numbox-input" max="10" min="0" step="5"  type="number" v-model="score.value" disabled="disabled"/>
                                <button class="mui-btn mui-numbox-btn-plus" type="button" @click="add(i)">+</button>
                            </div>
                        </div>
                    </li>
                     <li>
                        <div class="mui-input-row mui-checkbox decision-details-box">
                            <label style="font-weight: bold">总分</label>
                            <div class="mui-numbox onScore-count" style="background-color:#fff">
                               <input class="mui-numbox-input" type="number" v-model="total" disabled="disabled"/>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <div class="audit-button">
            <ul>
                <li class="audit-sure oneScore-sure">
                    <button type="button" class="mui-btn mui-btn-blue" @click="submit">提交打分</button>
                </li>
            </ul>
        </div>
    </div>
</div>
</template>
<script>
import { mapState, mapMutations } from 'vuex'
import commonHeader from '@/components/commonHeader.vue'
import { Swipe, SwipeItem } from 'mint-ui';
import API from '@/service/api'
export default {
    components: { commonHeader, Swipe, SwipeItem },
    data() {
        return {
            title: '一审打分',
            data: {},
            resolve: {},
            imgList: [],
            scoreList: [],
        }
    },
    computed: {
        ...mapState( [ 'sample_id', 'sample_no' ] ),
        total () {
            let total = 0
            this.scoreList.forEach(row => {
                total+=row.value
            })
            return total
        }
    },
    methods: {
        ...mapMutations( [ 'UPDATE_SHOW_LOADING' ] ),
        add(i) {
            if(this.scoreList[i].value<10) this.scoreList[i].value+=5
        },
        reduce(i) {
            if(this.scoreList[i].value>0) this.scoreList[i].value-=5
        },
        async initialization() {
            this.resolve = this.$route.params.record
            //获取基本信息
            this.data = await API.currency.getSampleDetail({ ID: this.sample_no })
            //获取样衣图片列表
            let imgs = await API.currency.getSampleImgs({ sampleId: this.sample_id })
            for(let i = 1; i<6; i++) {
                const img = imgs[`limg${i}`]
                if(img) this.imgList.push(img)
            }
            //启动图片预览
            this.$previewRefresh()
            API.oneck.getScoreItem().then(scores=> {
                scores.forEach(row => {
                    this.scoreList = [...this.scoreList, { 
                        sampleId: this.sample_id, 
                        scoreID: row.ID, 
                        scoreName: row.scoreName, 
                        value: 0, 
                    }]
                })
                
            })
            this.UPDATE_SHOW_LOADING(false)
        },
        submit(status) {
            this.UPDATE_SHOW_LOADING(true)
            API.oneck   .submitSampleMark({ ids: this.scoreList }).then(res=> {
                this.handle(res)
            })
        },
        handle(res) {
            this.UPDATE_SHOW_LOADING(false)
            if(res.code == 1) {
                this.$success()
                setTimeout(()=>{
                    this.$router.push( { name: 'oneck' } )
                },1000)
            }else {
                this.$error(res.errMsg)
            }
        }
    },
    created() {
       this.initialization()
    } 
}
</script>
<style lang="less" scoped>
.audit-button{
    .mui-btn-yellow {
        background-color: #ffaf00 !important;
        color: #ffffff
    }
}
</style>